<!DOCTYPE html>
<!-- <html lang="en"> -->
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="img/32X32.ico" rel="shortcut icon" />
<title>JK</title>
<!-- load stylesheets -->
<!-- <link rel="stylesheet" href="http://fonts.useso.com/css?family=Open+Sans:100,300,400"> -->
<!-- Google web font "Open Sans" -->
<link rel="stylesheet" href="font-awesome-4.5.0/css/font-awesome.min.css">
<!-- Font Awesome -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- Bootstrap style -->
<link rel="stylesheet" href="css/magnific-popup.css">
<!-- Magnific pop up style -->
<link rel="stylesheet" href="css/templatemo-style.css">
<!-- Templatemo style -->

<!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
</head>

<body id="top" class="home">

<div class="container-fluid">
	<div class="row">

		<div class="tm-navbar-container">

		<!-- navbar   -->
		<nav class="navbar navbar-full navbar-fixed-top">

			<button class="navbar-toggler hidden-md-up" type="button" data-toggle="collapse" data-target="#tmNavbar">
				&#9776;
			</button>

			<div class="collapse navbar-toggleable-sm" id="tmNavbar">

				<ul class="nav navbar-nav">
					<li class="nav-item">
						<a class="nav-link" href="#top">简介</a>
					</li>
					<li class="nav-item">
						<a class="nav-link" href="#tm-section-2">项目开发</a>
					</li>
					<li class="nav-item">
						<a class="nav-link" href="#tm-section-3">部分展示</a>
					</li>
					<li class="nav-item">
						<a class="nav-link" href="#tm-section-4">联系</a>
					</li>
					<li class="nav-item" style="display: none;">
						<a class="nav-link external" href="columns.html">列表</a>
					</li>
				</ul>

			</div>

		</nav>

	  </div>

   </div>

   <div class="row">
		<div class="tm-intro">

			<section id="tm-section-1">
				<div class="tm-container text-xs-center tm-section-1-inner">
					<img src="img/myselft.jpg" alt="Logo" class="tm-logo" style="width:152px;height:152px;">
					<h1 class="tm-site-name">王敬文</h1>
					<p class="tm-intro-text">开发工程师</p>
					<a href="#tm-section-2" class="tm-intro-link">开始了解</a>
				</div>
		   </section>

		</div>
	</div>

	<div class="row gray-bg">

		<div id="tm-section-2" class="tm-section">
			<div class="tm-container tm-container-wide">
				<div class="tm-news-item">

					<div class="col-xs-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 tm-news-item-img-container">
						<img src="img/tm-600x300-003.png" alt="Image" class="img-fluid tm-news-item-img">
					</div>

					<div class="col-xs-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 tm-news-container">
						<h2 class="tm-news-title dark-gray-text">人人积金</h2>
						<p class="tm-news-text">外包项目之一，主要做虚拟货币交易，分pc端和微信公众号端，实现用手机或者电脑能够分析货币行情，购买抛出等网络交易</p>
						<a href="http://www.rrjj.com" target="_blank" class="btn tm-light-blue-bordered-btn tm-news-link">详细</a>
					</div>
				</div>

				<div class="tm-news-item">

					<div class="col-xs-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 flex-order-2 tm-news-item-img-container">
						<img src="img/tm-600x300-002.png" alt="Image" class="img-fluid tm-news-item-img">
					</div>

					<div class="col-xs-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 tm-news-container flex-order-1">
						<h2 class="tm-news-title dark-gray-text">芭芭多护肤品</h2>
						<p class="tm-news-text">芭芭多芦荟郑州分公司，主要开发手机端微信公众号、小程序芭芭多系列电商网站，及pc端第三方外包项目网站</p>
						<a href="http://www.wzywl.com" target="_blank" class="btn tm-light-blue-bordered-btn tm-news-link">详细</a>
					</div>
				</div>

				<div class="tm-news-item">

					<div class="col-xs-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 tm-news-item-img-container">
						<img src="img/tm-600x300-001.png" alt="Image" class="img-fluid tm-news-item-img">
					</div>

					<div class="col-xs-12 col-sm-12 col-md-12 col-lg-6 col-xl-6 tm-news-container">
						<h2 class="tm-news-title dark-gray-text">国惠网系列</h2>
						<p class="tm-news-text">国惠网系列在2014-2015年左右开发，主要针对深圳市个体门面购买pos机免费建站，后期发展对全国的国惠网、国惠商城、国惠支付、商协互联、酒店管理系统等</p>
						<a href="http://www.ghui123.com" target="_blank" class="btn tm-light-blue-bordered-btn tm-news-link">详细</a>
					</div>
				</div>
			</div>
	   </div>

   </div> <!-- row -->

	<div class="row">

		<section id="tm-section-3" class="tm-section">
			<div class="tm-container text-xs-center">

				<h2 class="blue-text tm-title">部分展示</h2>
				<p class="margin-b-5">每个公司都不止开发一个项目，每个项目都有自己独特的特点</p>
				<p>图片展示项目，点击进入项目页面</p>

				<div class="tm-img-grid">
					<div class="tm-gallery-img-container">
						<a href="img/tm-450x300-12.jpg" target="_blank" class="tm-gallery-img-link">
							<img src="img/tm-450x300-12.jpg" alt="Image" class="img-fluid tm-gallery-img"> <!-- 300x200 -->
						</a>
					</div>
					<div class="tm-gallery-img-container">
						<a href="http://www.rrjj.com" target="_blank" class="tm-gallery-img-link">
							<img src="img/tm-450x300-11.jpg" alt="Image" class="img-fluid tm-gallery-img">
						</a>
					</div>
					<div class="tm-gallery-img-container">
						<a href="http://www.wzywl.com" target="_blank" class="tm-gallery-img-link">
							<img src="img/tm-450x300-10.jpg" alt="Image" class="img-fluid tm-gallery-img">
						</a>
					</div>
					<div class="tm-gallery-img-container">
						<a href="http://credit.zhxhlm.com/" target="_blank" class="tm-gallery-img-link">
							<img src="img/tm-450x300-09.jpg" alt="Image" class="img-fluid tm-gallery-img">
						</a>
					</div>
					<div class="tm-gallery-img-container">
						<a href="http://pay.zhxhlm.com/" target="_blank" class="tm-gallery-img-link">
							<img src="img/tm-450x300-08.jpg" alt="Image" class="img-fluid tm-gallery-img">
						</a>
					</div>
					<div class="tm-gallery-img-container">
						<a href="http://credit.zhxhlm.com/job.html" target="_blank" class="tm-gallery-img-link">
							<img src="img/tm-450x300-07.jpg" alt="Image" class="img-fluid tm-gallery-img">
						</a>
					</div>
					<div class="tm-gallery-img-container">
						<a href="http://www.ghui123.com/shop" target="_blank" class="tm-gallery-img-link">
							<img src="img/tm-450x300-06.jpg" alt="Image" class="img-fluid tm-gallery-img">
						</a>
					</div>
					<div class="tm-gallery-img-container">
						<a href="http://www.ghui123.com/login/business?redirectUrl=%2Fbusiness%2Finformation%2Findex#zp-master" target="_blank" class="tm-gallery-img-link">
							<img src="img/tm-450x300-05.jpg" alt="Image" class="img-fluid tm-gallery-img">
						</a>
					</div>
					<div class="tm-gallery-img-container">
						<a href="http://www.zhxhlm.com/industry.html" target="_blank" class="tm-gallery-img-link">
							<img src="img/tm-450x300-04.jpg" alt="Image" class="img-fluid tm-gallery-img">
						</a>
					</div>
					<div class="tm-gallery-img-container">
						<a href="http://www.zhxhlm.com/article.html" target="_blank" class="tm-gallery-img-link">
							<img src="img/tm-450x300-03.jpg" alt="Image" class="img-fluid tm-gallery-img">
						</a>
					</div>
					<div class="tm-gallery-img-container">
						<a href="http://www.zhxhlm.com/login?redirectUrl=%2Fassociation%2Findex" target="_blank" class="tm-gallery-img-link">
							<img src="img/tm-450x300-02.jpg" alt="Image" class="img-fluid tm-gallery-img">
						</a>
					</div>
					<div class="tm-gallery-img-container">
						<a href="http://www.ghui123.com/" target="_blank" class="tm-gallery-img-link">
							<img src="img/tm-450x300-01.jpg" alt="Image" class="img-fluid tm-gallery-img">
						</a>
					</div>
				</div>
			</div>
		</section>

	</div> <!-- row -->

	<div class="row gray-bg">

		<section id="tm-section-4" class="tm-section">
			<div class="tm-container">

				<h2 class="blue-text tm-title text-xs-center">联系我</h2>

				<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 col-xl-8" style="display: none;">
					<form action="index.html" method="post" class="tm-contact-form">
						<div class="form-group col-xs-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 tm-form-group-left">
							<input type="text" id="contact_name" name="contact_name" class="form-control" placeholder="姓名"  required/>
						</div>
						<div class="form-group col-xs-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 tm-form-group-right">
							<input type="email" id="contact_email" name="contact_email" class="form-control" placeholder="邮箱"  required/>
						</div>
						<div class="form-group">
							<input type="text" id="contact_subject" name="contact_subject" class="form-control" placeholder="标题"  required/>
						</div>
						<div class="form-group">
							<textarea id="contact_message" name="contact_message" class="form-control" rows="6" placeholder="内容 " required></textarea>
						</div>

						<button type="submit" class="btn tm-light-blue-bordered-btn pull-xs-right">提交</button>
					</form>
				</div> <!-- col -->

				<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 col-xl-4 margin-top-xs-50">
					<h3 class="light-blue-text tm-subtitle">开发者联系方式</h3>
					<p>如果你感觉我们可以进一步交流，请联系我。</p>
					<p>
						Tel: <a href="tel:15889796621">15889796621</a><br>
						Email: <a href="mailto:wjw@jieerwenking.com">wjw@jieerwenking.com</a>
					</p>
				</div>
			</div>
		</section>

		<!-- footer -->
		<footer class="tm-footer">
			<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
				<p class="text-xs-center tm-footer-text">Copyright © 2000-2016 阿文制作 版权所有	<a target="_blank" href="https://www.jieerwenking.com/" style="color: #ff0000;">官网</a></p>
			</div>
		</footer>

	</div> <!-- row -->

</div> <!-- container-fluid -->

<!-- load JS files -->

<script src="js/jquery-1.11.3.min.js"></script>
<script src="js/tether.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.singlePageNav.min.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>

<!-- Templatemo scripts -->
<script>

	$(document).ready(function(){

		var mobileTopOffset = 54;
		var desktopTopOffset = 80;
		var topOffset = desktopTopOffset;

		if($(window).width() <= 767) {
			topOffset = mobileTopOffset;
		}

		/* Single page nav
		-----------------------------------------*/
		$('#tmNavbar').singlePageNav({
		   'currentClass' : "active",
			offset : topOffset,
			'filter': ':not(.external)'
		});

		/* Handle nav offset upon window resize
		-----------------------------------------*/
		$(window).resize(function(){
			if($(window).width() <= 767) {
				topOffset = mobileTopOffset;
			}
			else {
				topOffset = desktopTopOffset;
			}

			$('#tmNavbar').singlePageNav({
				'currentClass' : "active",
				offset : topOffset,
				'filter': ':not(.external)'
			});
		});


		/* Collapse menu after click
		-----------------------------------------*/
		$('#tmNavbar a').click(function(){
			$('#tmNavbar').collapse('hide');
		});
		// $("button").click(function(){
		// 	$(".tm-navbar-container").addClass("bg-inverse");
		// });

		/* Turn navbar background to solid color starting at section 2
		---------------------------------------------------------------*/
		var target = $("#tm-section-2").offset().top - topOffset;

		if($(window).scrollTop() >= target) {
			$(".tm-navbar-container").addClass("bg-inverse");
		}
		else {
			$(".tm-navbar-container").removeClass("bg-inverse");
		}

		$(window).scroll(function(){

			if($(this).scrollTop() >= target) {
				$(".tm-navbar-container").addClass("bg-inverse");
			}
			else {
				$(".tm-navbar-container").removeClass("bg-inverse");
			}
		});


		/* Smooth Scrolling
		--------------------------------------------------------------*/
		$('a[href*="#"]:not([href="#"])').click(function() {
			if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
				&& location.hostname == this.hostname) {

				var target = $(this.hash);
				target = target.length ? target : $('[name=' + this.hash.slice(1) +']');

				if (target.length) {

					$('html, body').animate({
						scrollTop: target.offset().top - topOffset
					}, 1000);
					return false;
				}
			}
		});


		/* Magnific pop up
		------------------------- */
//		$('.tm-img-grid').magnificPopup({
//			delegate: 'a', // child items selector, by clicking on it popup will open
//			type: 'image',
//			gallery: {enabled:true}
//		});
	});

</script>

</body>
</html>
